<template>
  <view>
    <!-- 普通弹窗 -->
    <uni-popup ref="popup" background-color="#fff" mask-background-color="rgba(0,0,0,0)" :is-mask-click="false" type="bottom" borderRadius='20px 20px 0 0 '>
      <view class="popup-content">
        <view class="popup-header">
          <text class="popup-title">AI生成</text>
          <uni-icons type="closeempty" size="24" @click="closePopup"></uni-icons>
        </view>
        <view class="popup-body">
          <text>{{AIContent}}</text>
        </view>
        <view class="popup-footer">
          <button class="popup-btn" @click="rewriteEvaluation">重写</button>
          <button type="primary" class="popup-btn" @click="replaceEvaluation">替换</button>
        </view>
      </view>
    </uni-popup>
  </view>
</template>

<script setup>
const props = defineProps({
  id: {
    type: String,
    required: true
  },
  title: {
    type: String,
    required: true
  },
  subtitle: {
    type: String,
    default: ''
  },
  timeRange: {
    type: String,
    default: ''
  },
  content: {
    type: String,
    default: ''
  }
})

const emit = defineEmits(['edit'])

const popup = ref(null)

const onEdit = () => {
  emit('edit', props.id)
}
</script>

<style lang="scss" scoped>
	.popup-content {
	  padding: 20px;
	  border-radius: 20px 20px 0 0;
	  border-top: 1px solid #e5e5e5;
	
	  .popup-header {
	    display: flex;
	    justify-content: space-between;
	    align-items: center;
	
	    .popup-title {
	      font-size: 16px;
	      font-weight: 500;
	    }
	  }
	
	  .popup-body {
	    font-size: 14px;
	    line-height: 1.5;
	    padding: 20px 0;
	    height: 200px;
	    overflow-y: auto;
	  }
	
	  .popup-footer {
	    display: flex;
	    justify-content: space-between;
	    align-items: center;
	    background-color: #fff;
	  }
	  .popup-footer button {
	    display: inline-block;
	    margin: unset;
	    font-size: 14px;
	  }
	}
</style> 